<template>
  <div class="rechargeChatDetails">
    <integralNav></integralNav>
    <div class="writing_right">
      <div class="TitleList">
        <div class="TitleList_padding pointsdetails_title">
          <div class="TitleList_top">
            <div class="pointsdetails_title_left">
              <div class="TitleList_top_title"><span></span>订单明细</div>
            </div>
           <div class="pointsdetails_title_right">
            <div class="title_right_dt">
              <a href="#/integral/rechargeDetails"><i class="el-icon-warning-outline"></i>发票索取</a>
            </div>
           </div>
          </div>
        </div>
        <div class="pointsdetails_content">
          <div class="allflow" v-loading="loading" element-loading-spinner="el-icon-loading"
					element-loading-text="拼命加载中" element-loading-background="rgba(255, 255, 255, 1)">
            <div class="allflow_content">
              <div class="allflow_content_list">
                <div class="content_list_li">订单号</div>
                <div class="content_list_li">发生时间</div>
                <div class="content_list_li center">购买产品</div>
                <div class="content_list_li center">订单类型</div>
                <div class="content_list_li center">支付状态</div>
                <div class="content_list_li center">支付方式</div>
                <div class="content_list_li">金额</div>
                <div class="content_list_li center">操作</div>
              </div>
            </div>
            <div class="allflow_content">
              <div class="allflow_content_list" v-for="item in infos.data">
                <div class="content_list_li">{{ item.order_number }}</div>
                <div class="content_list_li">{{ item.create_time }}</div>
                <div class="content_list_li center">{{ product_type[item.product_type] }}</div>
                <div class="content_list_li center">{{ purchase_type[item.purchase_type] }}</div>
                <div class="content_list_li center">{{ item.is_payment?'已支付':'未支付'}}</div>
                <div class="content_list_li center">{{ item.payment_method }}</div>
                <div class="content_list_li">￥{{ item.total_amount }}.00</div>
                <div class="content_list_li center" v-if="item.is_payment">-</div>
                <div class="content_list_li center" v-else><a :href="pay_url[item.purchase_type]+item.id">去付款</a></div>
              </div>


              <div class="not_data not_data2" v-show="infos.data.length===0">
                <div class="not_data_icon"><img src="@a/img/bg26.jpg"/></div>
                <div class="not_data_title">暂无数据</div>
              </div>
            </div>
            <div class="page">
              <el-pagination
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  :current-page="infos.current_page"
                  :page-sizes="per_pages"
                  :page-size="infos.per_page"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="infos.total">
              </el-pagination>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- 充值弹窗 -->
    <rechargeWindow v-if="rechargeShow" @close="rechargeShow = false"></rechargeWindow>
  </div>
</template>


<script>
import integralNav from "@c/common/integralNav/integralNav";
import rechargeWindow from "@c/common/rechargeWindow/rechargeWindow";

export default {
  name: "rechargeDetails",
  data() {
    return {
      rechargeShow: false,
      interval: null,
      rechargepoints: false,
      RechargeSuccessful: false,
      activeTab: 0,
      infos: {
        data: [],
        per_page: 10,
        current_page: 1,
        last_page: 1,
        total: 0
      },
      product_type: {
        'robot' : 'AI机器人',
        'point' : '积分充值',
        'chatdog' : 'ChatDog',
      },
      purchase_type: {
        'new' : '新购',
        'renew' : '续费',
        'upgrade' : '升级',
      },
      pay_url: {
        'new' : '#/alRobot/NewAiRobotNewPurchase/NewAiRobotNewPurchase?order_id=',
        'renew' : '#/alRobot/NewAiRobotRenew/NewAiRobotRenew?order_id=',
        'upgrade' : '#/alRobot/NewAiRobotDetails/NewAiRobotDetails?order_id=',
      },

      default_index: 0,
      can_swiper: false,
      per_pages: [10, 20, 30],
      rechargeList: [],
      amoney: 0,
      aintegral: 0,
      result: 0,
      images: require("@a/img/bn21.png"),
      loading: true,
    };
  },
  components: {
    integralNav,
    rechargeWindow
  },
  methods: {
    openProtocol() {
      window.open('https://www.ai-dog.net/serviceAgreement.html', '_blank');
    },
    showWindow(){
      let that = this;
      that.rechargeShow = true;
    },
    closeWindow(){
      let that = this;
      that.rechargepoints = false;
      clearInterval(that.interval)
      that.getList()
    },
    //分页
    handleSizeChange(val) {
      this.infos.per_page = val
      this.getList()
    },
    handleCurrentChange(val) {
      this.infos.current_page = val
      this.getList()

    },
    handleChildClick(money, integral, images) {
      this.amoney = money
      this.aintegral = integral
      this.images = images
    },
    getList() {
      // loading 开始
      this.loading = true;

      let that = this;
      that.axios.get('/api1/newOrders/list', {
        params: {
          page: that.infos.current_page,
          list_rows: that.infos.per_page,
        }
      }).then(res => {
        // loading结束
        this.loading = false;

        that.infos = res.result;

      })
    },


  },

  created() {
    this.getList()
  }
}
</script>

<style>
@import "rechargeChatDetails.css";
</style>
